<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ page contentType="text/html; charset=UTF-8" language="java"
	import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/page/base.jsp"%>
<%@ taglib prefix="d" uri="/doone-comm-ui-tags"%>

<html>
	<head>
		<title>企业门店信息</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->


		<style type="text/css">
.sideDiv {
	z-index: 9999;
	margin-bottom: 3px;
	display: none;
	position: absolute;
	border: solid 1px #6e8bde;
}

.mapDiv {
	clear: both;
	margin: 4px;
	padding: 2px;
}

.filterDiv {
	color: #C7EDCC;
	background-color: inherit;
	position: absolute;
	top: 0px;
	left: 0px;
	filter: alpha(opacity =50);
}
.selectedTag{float:left;display:inline-block;margin-right:10px;margin-bottom:10px;padding:5px;border:solid 1px #339900;color:#339900}
.notSelectedTag{float:left;display:inline-block;margin-right:10px;margin-bottom:10px;padding:5px;border:solid 1px #999999;color:#999999}
ul#addedTags li a{margin-left:10px;color:#CC0000;text-decoration:none}
ul#existTags li a{margin-left:10px;color:#CC0000;text-decoration:none}
ul#addedTags li a:hover{color:#cc0000}
.text04{width:350px;}
table{cursor:default;}
.icon_tjyp,.icon_tjtp,.icon_tjdmt{height:24px;line-height:24px;text-decoration:none;float:left;padding:0px 0px 0px 24px;margin-right:15px;display:inline-block;color:#666}
.icon_tjyp{background:url(<%=path%>/manage/images/icon_tjyy.png) 0 0 no-repeat;}
.icon_tjtp{background:url(<%=path%>/manage/images/icon_tjtp.png) 0 0 no-repeat;}
.icon_tjdmt{background:url(<%=path%>/manage/images/icon_tjdmt.png) 0 0 no-repeat;}
</style>
		<link type="text/css" href="<%=path%>/manage/css/layout.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/manage/css/Tooltip.css" />
        <link type="text/css" href="<%=path%>/manage/css/new_style.css" rel="stylesheet" />
        
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery-1.4.4.min.js"></script>

		<script type="text/javascript"
			src="<%=path%>/manage/js/easyTooltip.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery-ui-1.8.11.custom.min.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery.wysiwyg.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/hoverIntent.js"></script>
		<script type="text/javascript" src="<%=path%>/manage/js/superfish.js"></script>
		<script type="text/javascript" src="<%=path%>/manage/js/custom.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/My97DatePicker/WdatePicker.js"></script>
		<%-- 验证js Start --%>
		<script type="text/javascript" src="<%=path%>/manage/js/Tooltip.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery.validate.min.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery.validate.methods.min.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery.validate.defaults.js"></script>
		<script type="text/javascript"
			src="<%=path%>/manage/js/jquery_form.js"></script>
		<script type="text/javascript" src="<%=path%>/manage/js/pcc/cascade-1.0.3.js"></script>
		<%@ include file="../contentAttach.jspf" %>
	</head>


	<script type="text/javascript">
	function bindtagsEvent() {
		$("#existTags .notSelectedTag").toggle(function(){
				$(this).attr("class","selectedTag");
				var indexs = "," + $(this).attr("index");
				$("#selectedTagsContainer").val($("#selectedTagsContainer").val()+indexs);
			},function(){
				$(this).attr("class","notSelectedTag");
				var indexs = "," + $(this).attr("index");
				var selectedTagsContainer = $("#selectedTagsContainer").val();
				var value = selectedTagsContainer.replace(indexs,"");
				$("#selectedTagsContainer").val(value);
			}
		);
		$("#existTags .selectedTag").toggle(function(){
				$(this).attr("class","notSelectedTag");
				var indexs = "," + $(this).attr("index");
				var selectedTagsContainer = $("#selectedTagsContainer").val();
				var value = selectedTagsContainer.replace(indexs,"");
				$("#selectedTagsContainer").val(value);
			},function(){
				$(this).attr("class","selectedTag");
				var indexs = "," + $(this).attr("index");
				$("#selectedTagsContainer").val($("#selectedTagsContainer").val()+indexs);
			}
		);
	}
	
	//检测文件格式
	function validateFile(obj) {       
	    var filepath = obj.value;
		var fileArr = filepath.split("\\");
		var fileTArr = fileArr[fileArr.length - 1].toLowerCase().split(".");
		var filetype = fileTArr[fileTArr.length - 1];
		if (filetype != "jpg" && filetype != "png") {
			alert("必须上传jpg、png格式的文件");
			$(obj).parent().html('<input type="file" name="'+$(obj).attr("name")+'" style="width:180px" onchange="validateFile(this)">');
		}
	}
	
	function btnSubmit() {
		showLoadStatus();
		//获取选择的tags
		var indexs = "";
		$("#existTags .selectedTag").each(function(){
			indexs = indexs + "," + $(this).attr("index");
		});
		$("#selectedTagsContainer").val(indexs);
		$("#editEnterShopForm").submit();
		if(!editEnterShopForm.valid()){
			hideLoadStatus();
		}
	}
	
	function initAddress() {
		var province = $("#varShopProvince").val();
		var city = $("#varShopCity").val();
		var area = $("#varShopArea").val();
		var result = province;
		if(city!="市辖区"&&city!="县"){
			result += city;
		}
		if(area!="市辖区"&&area!="县"){
			result += area;
		}
		$("#varShopAddress").val(result);
	}
	
	var editEnterShopForm;
	$(document).ready(function(){
		var province = "<s:property value='enterpShopTab.varShopProvince' escape='false' />";
		var city = "<s:property value='enterpShopTab.varShopCity' escape='false' />";
		var area = "<s:property value='enterpShopTab.varShopArea' escape='false' />";
		xn.init(['varShopProvince','varShopCity','varShopArea','name',province,city,area,'value']);
		$("#mapDialog").dialog({
			autoOpen : false,
			width : 900,
			height : 470,
			modal : true,
			title : '选取经纬度',
			buttons : {
				"确定" : function() {
					$(this).dialog("close");
				}
			},
			close : function() {
			}
		});
		jQuery.validator.addMethod("checkPhoneNum", function(value, element, params) {
			var exr = new RegExp("^((\\d{3,4})|\\d{3,4}-)?\\d{7,8}$");
			return this.optional(element) || (exr.test(value));
		  }, $.validator.format("格式如:XXX-XXXXXXXX，XXXXXXXXXXX"));
		jQuery.validator.addMethod("checkPostNum", function(value, element, params) {
			var exr = new RegExp("^\\d{6}$");
			return this.optional(element) || (exr.test(value));
		  }, $.validator.format("格式为6位数字"));
		editEnterShopForm = $("#editEnterShopForm").validate({
			rules : {
				"enterpShopTab.varShopName" : {
					required : true
				},
				"enterpShopTab.varShopArea" : {
					required : true
				},
				"enterpShopTab.varShopProvince" : {
					required : true
				},
				"enterpShopTab.varShopCity" : {
					required : true
				},
				"enterpShopTab.varShopLongitude" : {
					required : true
				},
				"enterpShopTab.varShopLatitude" : {
					required : true
				},
				"enterpShopTab.varShopPostnum" : {
					maxlength : 6
				},
				"enterpShopTab.varShopAddress":{
					required : true
				},
				"enterpShopTab.varShopPhonenum":{
					checkPhoneNum:true
				},
				"enterpShopTab.varShopPostnum":{
					checkPostNum:true
				}
			},
			messages : {
				"enterpShopTab.varShopName" : {
					required : "门店名称必填"
				},
				"enterpShopTab.varShopArea" : {
					required : "地区必选"
				},
				"enterpShopTab.varShopProvince" : {
					required : "省份必选"
				},
				"enterpShopTab.varShopCity" : {
					required : "城市必选"
				},
				"enterpShopTab.varShopLongitude" : {
					required : "经度必填"
				},
				"enterpShopTab.varShopLatitude" : {
					required : "纬度必填"
				},
				"enterpShopTab.varShopPostnum" : {
					maxlength : "邮编最长6位"
				},
				"enterpShopTab.varShopAddress":{
					required : "地址必填"
				},
				"enterpShopTab.varShopPhonenum":{
				},
				"enterpShopTab.varShopPostnum":{
				}
			}
		});
		bindtagsEvent();
	});
	
	function openBaidu() {
		$('#mapDialog').dialog('open');
		$("#GMap").show();
		var lng = $("#varShopLongitude").val();
		var lat = $("#varShopLatitude").val();
		if(lng!="" && lat!=""){
			markCurrentPoint(lng,lat);
			$("#r-result-x").html(lng);
			$("#r-result-y").html(lat);
		} else {
			$("#r-result-x").html("");
			$("#r-result-y").html("");
			initMap();
		}
		setSearchAddress($("#varShopAddress").val());
		$("#searchResults").html("");
	}
	
	function closeMap(){
		$('#mapDialog').dialog('close');
	}
	
	function openggg() {
		$("#shopCatePopup").load(root+"/manage/page/shop/cateTree.jsp",function() {
			opdialog();
		});
	}
	
	function opdialog() {
		$("#shopCatePopup").dialog({
			autoOpen : false,
			width : 300,
			height : 470,
			modal : true,
			title : '选取经纬度',
			buttons : {
				"确定" : function() {
					$(this).dialog("close");
				}
			},
			close : function() {
			}
		});
		$("#shopCatePopup").dialog("open");
	}

</script>
	<body>
		<div>
			<p class="sitemap">
					当前位置：企业信息管理> 企业门店息管理
			</p>
			<h1>
					企业门店管理
			</h1>
		</div>

		<div id="openEnterShopDialog">
			<s:form action="/dataBinding/doShopSave.action" method="post" id="editEnterShopForm" enctype="multipart/form-data">
	<s:hidden name="enterpShopTab.intShopId" id="intShopId"></s:hidden>
	<s:hidden name="intCateId" ></s:hidden>
	<s:hidden name="intContentId" ></s:hidden>
	<table class="fullwidth" cellpadding="0" border="0" celgetPointByAddress()lspacing="0" id="contenttable" style="padding-top:10px">
		<tr>
			<td width="60"  valign="top">缩略图</td>
			<td colspan="2">
				<s:hidden name="enterpShopTab.varThumbImg"></s:hidden>
				<s:if test="enterpShopTab.varThumbImg==null">
					<img id="varThumbImg" src="" width="54px" height="32px" style="vertical-align:bottom;display:none">
				</s:if>
				<s:else>
					<img id="varThumbImg" src="<%=serverUrl %><s:property value="enterpShopTab.varThumbImg" />" width="54px" height="32px" style="vertical-align:bottom">
				</s:else>
				<s:file name="titleFile" cssStyle="width:296px" onchange="validateFile(this)"></s:file>
			</td>
		</tr>
		<tr>
			<td width="60"  valign="top">
				门店图片
			</td>
			<td>
				<s:hidden name="enterpShopTab.varIconUrl"></s:hidden>
				<s:if test="enterpShopTab.varIconUrl==null">
					<img id="varIconUrl" src="" width="54px" height="32px" style="vertical-align:bottom;display:none">
				</s:if>
				<s:else>
                	<img id="varIconUrl" src="<%=serverUrl %><s:property value="enterpShopTab.varIconUrl" />" width="54px" height="32px" style="vertical-align:bottom">
				</s:else>
            	<s:file name="myFile" cssStyle="width:296px" onchange="validateFile(this)"></s:file>
            </td>
         </tr>
         <tr>
            <td  valign="top">
				门店名称
			</td>
			<td>
            	<s:textfield name="enterpShopTab.varShopName" id="varShopName" cssClass="text04"></s:textfield>
                <input type="hidden" name="enterpShopTab.intContentId" readonly value="<s:property value="#session.enterpShopContentId"/>">
                <span style="color: red">*</span>
			</td>
        </tr>
        <tr>
            <td  valign="top">
				门店描述
			</td>
			<td>
            	<s:textarea name="enterpShopTab.varDesc" id="varDesc"></s:textarea>
            </td>
        </tr>
        <tr>
			<td  valign="top">
				经营范围
			</td>
			<td>
				<s:textfield name="enterpShopTab.varBusinessArea" id="varBusinessArea"  cssClass="text04"></s:textfield>
			</td>
        </tr>
        <tr>
			<td  valign="top">
				营业时间
			</td>
			<td>
				<s:textfield name="enterpShopTab.varOpenTime" id="varOpenTime"  cssClass="text04"></s:textfield>
			</td>
		</tr>
		<tr>
        	<td rowspan="2"  valign="top">
            	门店地址
            </td>
			<td valign="top" >
				所在地区：
				<select name="enterpShopTab.varShopProvince" id="varShopProvince"></select>
				<select name="enterpShopTab.varShopCity" id="varShopCity"></select>
				<select name="enterpShopTab.varShopArea" onchange="initAddress();" id="varShopArea"></select>
				<span style="color: red">*</span>
			</td>
        </tr>
        <tr>
			<td valign="top" >
				街道地址：
				<s:textfield name="enterpShopTab.varShopAddress"
					id="varShopAddress" cssClass="text04"></s:textfield><span style="color: red">*</span>
                <span style="color:#ccc;">不需要重复填写省/市/区</span>
			</td>
		</tr>
		<tr>
			<td valign="top">
				邮政编码
			</td>
			<td>
				<s:textfield name="enterpShopTab.varShopPostnum"
					id="varShopPostnum" cssClass="text04"></s:textfield>
			</td>
		</tr>
        <tr>
        	<td  valign="top">
            	门店坐标
            </td>
            <td valign="top" >
            	经度：<s:textfield name="enterpShopTab.varShopLongitude"
					id="varShopLongitude"></s:textfield>
                纬度：<s:textfield name="enterpShopTab.varShopLatitude"
					id="varShopLatitude"></s:textfield>
				<span style="color: red">*</span>
                 <input type="button" id="btnTest" value="地图上获取经纬度" onclick="openBaidu();" />
            </td>
        </tr>
        <tr>
        	<td  valign="top">
				门店电话
			</td>
			<td>
				<s:textfield name="enterpShopTab.varShopPhonenum"
					id="varShopPhonenum"  cssClass="text04"></s:textfield>
			</td>
        </tr>
         <tr>
        	<td  valign="top">
				门店标签
			</td>
			<td colspan="5">
				<div>
					<ul id="addedTags">
					</ul>
					<div style="clear:both"></div>
				</div>
				<script type="text/javascript">
					function addNewTag(e){
						var charCode=(navigator.appName=="Netscape")?e.which:e.keyCode; 
						if(charCode==13){
							var v = $("#newTag").val();
							if(v!="") {
								$("#addedTags").append("<li class='selectedTag'><span>"+v+"</span><a href='javascript:void(0);' onclick='javascript:delTag(this);'>X</a></li>");
								$("#newTag").val("");
								$("#newTagsContainer").val($("#newTagsContainer").val()+","+v);
							}
						}
					}
					function delTag(obj) {
						var deletedTag = ","+$(obj).parent().children("span").html();
						var newTagsContainer = $("#newTagsContainer").val();
						var value = newTagsContainer.replace(deletedTag,"");
						$("#newTagsContainer").val(value);
						$(obj).parent().remove();
					}
					function delExistTag(obj) {
						var indexs = "," + $(obj).parent().attr("index");
						$("#delTagsContainer").val($("#delTagsContainer").val()+indexs);
						
						var selectedTagsContainer = $("#selectedTagsContainer").val();
						var value = selectedTagsContainer.replace(indexs,"");
						$("#selectedTagsContainer").val(value);
						$(obj).parent().remove();
					}
					function limitText(obj) {
						var str=obj.value; 
					    if (str.replace(/[^\x00-\xFF]/g,"aa").length>20) { 
					        str=str.substr(0,str.length-1); 
					    } 
					    obj.value=str; 
					}
				</script>
				<input id="newTag" type="text" onpaste="return false;" onchange="limitText(this);" onKeyUp="limitText(this);" maxLength="20" onKeyDown="addNewTag(event);" value="" /><span style="color:#ccc">按回车添加标签或选择可用标签</span>
				<br>
				<div style="margin:10px 0">可用标签（绿色为已选择的，再次点击取消选择）：</div>
				<ul id="existTags">
					<s:iterator value="enterpShopTab.usedTags" status="st">
						<s:if test="status==1">
							<li class="selectedTag" index="<s:property value="id" />"><span><s:property value="title" /></span><a href='javascript:void(0);' onclick='javascript:delExistTag(this);'>X</a></li>
						</s:if>
						<s:else>
							<li class="notSelectedTag" index="<s:property value="id" />"><span><s:property value="title" /></span><a href='javascript:void(0);' onclick='javascript:delExistTag(this);'>X</a></li>
						</s:else>
					</s:iterator>
				</ul>
				<input type="hidden" name="newTagsContainer" id="newTagsContainer" />
				<input type="hidden" name="selectedTagsContainer" value="<s:property value="selectedTagsContainer" />" id="selectedTagsContainer" />
				<input type="hidden" name="delTagsContainer" id="delTagsContainer" />
				<div style="clear:both"></div>
			</td>
        </tr>
        <%-- 
        <s:if test="intShopId==-1">
        	<%@ include file="../aAttrs.jspf" %>
        </s:if>
        <s:else>
        	<%@ include file="../eAttrs.jspf" %>
        </s:else>
        <tr>
        	<td>
            	附件
            </td>
        	<td>
				<a onclick="show(-1,5);" class="icon_tjtp">添加图片</a> 
            	<a onclick="show(-1,2);" class="icon_tjyp">添加音频</a>
                <a onclick="show(-1,3);" class="icon_tjdmt">添加视频</a>
            </td>
        </tr>
        <%@ include file="../contentImg.jspf" %>
        --%>
	</table>
	<div align="center" style="margin-bottom:20px;">
		<input type="button" value="提交" class="button" onclick="btnSubmit();">
	</div>
</s:form>
		</div>
		<div id="mapDialog" style="display: none;">
			<div id='GMap' style="display: none;">
			<%@ include file="../baiduMapLayer.jspf" %>
		</div>
		</div>
		<div id="uploadArea"></div>
		<div id="shopCatePopup" style="display:none;">
			<div id="treeDialog"></div>
		</div>
	</body>
</html>
